html {
  .gant-layout {
    .ant-pro {
      &-global-footer-links a {
        color: var(--text-color-secondary);

        &:hover {
          color: var(--text-color);
        }
      }

      &-global-footer-copyright {
        color: var(--text-color-secondary);
        font-size: var(--font-size-base);
      }

      &-global-header {
        height: var(--layout-header-height);
        background: var(--global-header-background);
        border-bottom: var(--global-header-box-border-bottom);
        box-shadow: var(--global-header-box-shadow);
        justify-content: space-between;
        &-logo {
          height: var(--layout-header-height);
          line-height: var(--layout-header-height);
        }

        &-trigger {
          height: var(--layout-header-height);
          padding: calc((var(--layout-header-height) - 18px) / 2)
            calc((var(--layout-header-height) - 15px) / 2);
          color: var(--global-header-trigger-color);
          font-size: 14px;
          vertical-align: baseline;
          background: var(--global-header-trigger-background);

          &:hover {
            background: var(--header-hover-background);
          }
          &+div{
            display:inherit;
          }
        }

        &.dark {
          height: var(--layout-header-height);

          & .action.opened {
            background: var(--primary-color);
          }
        }
      }

      &-page-header-wrap-page-header-warp {
        background-color: var(--component-background);
      }

      &-sider-menu {
        background: var(--sider-menu-background);

        .custom-menu-item-link {
          color: var(--sider-menu-text-color);
        }

        .ant-menu-submenu-arrow::before,
        .ant-menu-submenu-arrow::after {
          background: var(--sider-menu-text-color) !important;
        }

        &-logo {
          height: var(--layout-header-height);
          padding-right: 0px;
          padding-left: 0px;
          line-height: var(--layout-header-height);
          background: var(--layout-sider-background);
        }

        .ant-menu.ant-menu-sub {
          background: var(--sider-menu-submenu-background);

          .ant-menu-item-selected {
            background-color: var(--sider-menu-item-active-bg);
          }
        }

        &-sider {
          box-shadow: var(--sider-box-shadow) !important;
          // background-color: transparent !important;

          .ant-menu .ant-menu-item-selected {
            background-color: var(--sider-menu-item-active-bg);
          }

          &.fix-sider-bar {
            .ant-menu-root {
              height: calc(100vh - var(--nav-header-height));

              &::-webkit-scrollbar {
                width: 5px;
              }
            }
          }

          &.ant-layout-sider-light {
            .ant-pro-sider-menu-logo {
              background-color: var(--sider-menu-logo-background);
              border-bottom: var(--sider-menu-logo-border-bottom);
              box-shadow: var(--sider-menu-logo-box-shadow);

              h1 {
                color: var(--sider-menu-logo-color) !important;
              }
            }
          }

          &.ant-layout-sider-dark {
            .ant-pro-sider-menu-logo {
              background-color: var(--sider-menu-logo-background);
              border-bottom: var(--sider-menu-logo-border-bottom);
              box-shadow: var(--sider-menu-logo-box-shadow);

              h1 {
                color: var(--sider-menu-logo-color) !important;
              }
            }
          }
        }

        .top-nav-menu li.ant-menu-item {
          height: var(--layout-header-height);
          line-height: var(--layout-header-height);
        }

        .drawer .drawer-content {
          background: var(--layout-sider-background);
        }

        &:not(.ant-menu-inline-collapsed) {
          .ant-menu-item .anticon,
          .ant-menu-submenu-title .anticon {
            margin-right: 5px !important;
          }

          .indentation-generator(@level) when (@level <=10) {
            .ant-menu-submenu-title + ul {
              ant-menu-submenu-title,
              .ant-menu-item {
                padding-left: @level*15px !important;
              }

              .indentation-generator(@level+1);
            }
          }

          .ant-menu-submenu-title,
          .ant-menu-item {
            padding-left: 10px !important;

            & + ul {
              .ant-menu-submenu-title,
              .ant-menu-item {
                padding-left: 30px !important;
              }

              .indentation-generator(3);
            }
          }
        }
      }

      &-top-nav-header {
        height: var(--layout-header-height);
        background: var(--global-header-background);

        .ant-menu-submenu.ant-menu-submenu-horizontal {
          line-height: var(--layout-header-height);
        }

        &-main {
          height: var(--layout-header-height);
        }

        &-logo {
          height: var(--layout-header-height);
          line-height: var(--layout-header-height);

          h1 {
            max-width: 120px;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
            color:var(--sider-menu-logo-color);
          }
        }

        &-menu {
          .ant-menu.ant-menu-horizontal {
            height: var(--layout-header-height);
            line-height: var(--layout-header-height);
            background: var(--global-header-background);
          }

          .ant-menu-vertical.ant-menu-sub {
            background: var(--global-header-background);
          }
        }
      }

      &-basicLayout-content {
        padding-top: 5px !important; // 同layout的margin
      }

      &-fixed-header + .ant-pro-basicLayout-content {
        // 固定顶部
        padding-top: calc(
          var(--layout-header-height) + 5px
        ) !important; // 同layout的margin
      }
    }
  }
  //悬浮二级菜单定制
  .ant-menu-submenu-popup .ant-menu-sub {
    background: var(--sider-menu-background);
    .ant-menu-item,
    .ant-menu-submenu {
      border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    }
    .ant-menu-item,
    .ant-menu-submenu,
    .ant-menu-submenu-title {
      height: 30px;
      margin-top: 0;
      margin-bottom: 0;
      color: var(--sider-menu-text-color);
      line-height: 30px;
      &.ant-menu-item-selected {
        background: var(--sider-menu-item-active-bg);
      }
      &:active {
        background: var(--sider-menu-item-active-bg);
      }
      &-active {
        background: var(--sider-menu-item-active-bg);
      }
      .custom-menu-item,
      .custom-menu-item-link {
        color: var(--sider-menu-text-color);
        line-height: 30px;
      }
    }
  }
}
